<template>
  <el-dialog
    title="提示"
    :visible.sync="dialogVisible"
    width="30%"
    :before-close="handleClose"
  >
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="表名">
        <el-select v-model="form.name" placeholder="请选择">
          <el-option
            v-for="item in nameOption"
            :key="item.value"
            :label="item.label"
            :value="item.label"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="字段">
        <el-select v-model="form.sex" placeholder="请选择">
          <el-option
            v-for="item in fieldOptions"
            :key="item.value"
            :label="item.label"
            :value="item.label"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="比较符">
        <el-select v-model="form.age" placeholder="请选择">
          <el-option
            v-for="item in comparisonOptions"
            :key="item.value"
            :label="item.label"
            :value="item.label"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="比较值">
        <el-input
          type="textarea"
          :rows="2"
          placeholder="请输入内容"
          v-model="form.tagCondition"
        >
        </el-input>
      </el-form-item>
    </el-form>

    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="submit">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  props:{
    list:Array,
  },
  data() {
    return {
      dialogVisible: false,
      form: {
        name: "",
        sex: "",
        age: "",
        role:"",
      },
      nameOption: [
        {
          value: "选项1",
          label: "简历表",
        },
        {
          value: "选项2",
          label: "文件表",
        },
        {
          value: "选项3",
          label: "人员表",
        },
      ],
      fieldOptions: [
        {
          value: "选项1",
          label: "简历内容",
        },
        {
          value: "选项2",
          label: "简历表述",
        },
        {
          value: "选项3",
          label: "是否在任",
        },
      ],
      comparisonOptions: [
        {
          value: "选项1",
          label: "包含",
        },
        {
          value: "选项2",
          label: "不包含",
        },
        {
          value: "选项3",
          label: "等于",
        },
      ],
    };
  },
  methods: {
    init() {
      // this.dialogVisible = true;
      // this.getSelectedData();
    },
    submit(){
        // this.list.push(this.form);
        this.$emit('addData', this.form);

        this.dialogVisible = false;
    },
    //现在点击确定submit事件之后弹框不能关闭，有什么解决方案吗，代码
    handleClose() {
      this.dialogVisible = false;
    },
  },
};
</script>

<style>
</style>